<template>
  <el-form ref="form" :inline="true" label-width="80px">
    <div v-for="(item, index) in triggerList" :key="index">
      <p>触发器{{ index + 1 }}</p>
      <el-form-item>
        <el-select v-model="item.dataItemType" placeholder="请选择触发类型">
          <el-option
            v-for="dict in dataItemList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <!--前比较类型-->
      <el-form-item v-show="item.dataItemType">
        <el-select v-model="item.comparePatternFrontType" placeholder="请选择比较模式">
          <el-option
            v-for="dict in dict.type.engine_compare_pattern_type"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <!--前阈值-->
      <el-form-item v-show="item.comparePatternFrontType">
        <el-input v-model="item.compareFrontValue" placeholder="请输入比较值"/>
      </el-form-item>
      <!--连接条件-->
      <el-form-item v-show="item.compareFrontValue">
        <el-select v-model="item.conditionType" placeholder="请选择触发类型">
          <el-option
            v-for="dict in conditionList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <!--后比较条件-->
      <el-form-item v-show="item.conditionType==='0'">
        <el-select v-model="item.comparePatternAfterType" placeholder="请选择比较模式">
          <el-option
            v-for="dict in dict.type.engine_compare_pattern_type"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <!--后值-->
      <el-form-item v-show="item.comparePatternAfterType ">
        <el-input v-model="item.compareAfterValue" placeholder="请输入比较值"/>
      </el-form-item>
      <!--设定条件-->
      <el-form-item v-show="item.compareAfterValue ||item.conditionType==='1'">
        <el-select v-model="item.settingType" placeholder="请选择触发类型">
          <el-option
            v-for="dict in settingList"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <!--设定值-->
      <el-form-item v-show="item.settingType">
        <el-input v-model="item.settingValue" placeholder="请输入比较值"/>
      </el-form-item>
      <!--删除按钮-->
      <el-form-item>
        <el-button @click="deleteItem(index)" type="danger">删除</el-button>
      </el-form-item>
    </div>
    <p>
      <el-button :disabled="this.ruleType==='1'" @click="addItem" type="text">+新增触发器</el-button>
    </p>
  </el-form>
</template>

<script>
import {getTimeLong} from "../../../../../utils";

export default {
  name: "trigger",
  dicts: ['engine_trigger_type', 'engine_trigger_method', 'engine_compare_pattern_type', 'engine_trigger_event'],
  props: ['ruleId','trigger','ruleType'],
  data() {
    return {
      //触发器集合
      triggerList: [],
      //数据项选项
      dataItemMap: new Map,
      //数据项选项
      dataItemList:[{value: '0', label: '功率'},],
      //条件集合
      conditionList:[{value: '0', label: '且'},{value: '1', label: '终'}],
      //条件集合
      settingList:[{value: '0', label: '设置'},],
    }
  },
  mounted() {
  },
  watch: {
    trigger: {
      handler(newVal, oldVal) {
        if (newVal) {
          this.triggerList = JSON.parse(JSON.stringify(newVal));
          //过滤数据项
          this.triggerList.forEach(item => {
          })
          //强制渲染
          this.$forceUpdate();
        }
      }
    }
  },
  methods: {
    /** 添加触发器 */
    addItem() {
      this.triggerList.push({
        ruleId:this.ruleId,
        triggerId:getTimeLong(),
        dataItemType:null,//数据项
        comparePatternFrontType:null,//前比较条件
        compareFrontValue:null,//前比较值
        conditionType: null,//连接条件
        comparePatternAfterType:null,//后比较条件
        compareAfterValue: null,//后比较值
        settingType: null,//设定类型
        settingValue: null,//设定值
      });
    },
    /** 删除触发器 */
    deleteItem(index) {
      this.triggerList.splice(index, 1);
    },
  }
}
</script>
